import { FC } from 'react';
import { QuestionCheckboxPropsType, QuestionCheckboxDefaultProps } from './interface';
import { Typography, Checkbox, Space } from 'antd';
const { Paragraph } = Typography;
const Component: FC<QuestionCheckboxPropsType> = (props: QuestionCheckboxPropsType) => {
  const {
    title = '',
    isVertical = false,
    list = [],
  } = { ...QuestionCheckboxDefaultProps, ...props };
  return (
    <div>
      <Paragraph strong>{title}</Paragraph>
      <Space direction={isVertical ? 'vertical' : 'horizontal'}>
        {list.map((option) => {
          const { value, text, checked } = option;
          return (
            <Checkbox key={value} value={value} checked={checked}>
              {text}
            </Checkbox>
          );
        })}
      </Space>
    </div>
  );
};
export default Component;
